<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>

<h3>添加员工</h3>

{#1、自己手动写HTML页面#}
<form action="/app01/add_emp/" method="post">
    {% csrf_token %}

    {# 全局错误信息（non_field_errors） #}
    {% if clean_errors %}
        <div style="color: red;">
            {% for error in clean_errors %}
                <p>{{ error }}</p>
            {% endfor %}
        </div>
    {% endif %}

    <p>
        姓名：<input type="text" name="name" value="{{ form.name.value|default_if_none:'' }}">
        {% if form.name.errors %}
            <span style="color: red;">{{ form.name.errors.0 }}</span>
        {% endif %}
    </p>

    <p>
        年龄：<input type="text" name="age" value="{{ form.age.value|default_if_none:'' }}">
        {% if form.age.errors %}
            <span style="color: red;">{{ form.age.errors.0 }}</span>
        {% endif %}
    </p>

    <p>
        工资：<input type="text" name="salary" value="{{ form.salary.value|default_if_none:'' }}">
        {% if form.salary.errors %}
            <span style="color: red;">{{ form.salary.errors.0 }}</span>
        {% endif %}
    </p>
    <p>
        请再输入工资：<input type="text" name="r_salary" value="{{ form.r_salary.value|default_if_none:'' }}">
        {% if form.r_salary.errors %}
            <span style="color: red;">{{ form.r_salary.errors.0 }}</span>
        {% endif %}
    </p>

    <input type="submit">
</form>


{#2、通过form对象的as_p方法实现#}
{#<form action="" method="post" novalidate>#}
{#    {% csrf_token %}#}
{#    {{ form.as_p }}#}
{#    <input type="submit">#}
{#</form>#}

{#3、手动获取form对象的字段#}
{#<form action="" method="post" novalidate>#}
{#    {% csrf_token %}#}
{#    <div>#}
{#        <label for="id_{{ form.name.name }}">姓名</label>#}
{#        {{ form.name }} <span>{{ form.name.errors.0 }}</span>#}
{#    </div>#}
{#    <div>#}
{#        <label for="id_{{ form.age.name }}">年龄</label>#}
{#        {{ form.age }} <span>{{ form.age.errors.0 }}</span>#}
{#    </div>#}
{#    <div>#}
{#        <label for="id_salary">工资</label>#}
{#        {{ form.salary }} <span>{{ form.salary.errors.0 }}</span>#}
{#    </div>#}
{#    <input type="submit">#}
{#</form>#}


{#4、用for循环展示所有字段#}
{#<form action="" method="post" novalidate>#}
{#    {% csrf_token %}#}
{#    {% for field in form %}#}
{#        <div>#}
{#            <label for="id_{{ field.name }}">{{ field.label }}</label>#}
{#            {{ field }} <span>{{ field.errors.0 }}</span>#}
{#        </div>#}
{#    {% endfor %}#}
{#    <input type="submit">#}
{#</form>#}

</body>
</html>